<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<!-- for-mobile-apps -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>酒店展示页面</title>
<meta name="description" content="GARO is a real-estate template">
<meta name="author" content="Kimarotec">
<meta name="keyword" content="html5, css, bootstrap, property, real-estate theme , bootstrap template">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 商城的 -->
<link rel="stylesheet" type="text/css" href="res/static/css/main.css">
<link rel="stylesheet" type="text/css" href="res/layui/css/layui.css">
<script type="text/javascript" src="res/layui/layui.js"></script>
<!--  -->

<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,700,800' rel='stylesheet' type='text/css'>

<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" href="favicon.ico" type="image/x-icon">

<link rel="stylesheet" href="./HotelUser/assets/css/normalize.css">
<link rel="stylesheet" href="./HotelUser/assets/css/font-awesome.min.css">
<link rel="stylesheet" href="./HotelUser/assets/css/fontello.css">
<link href="./HotelUser/assets/fonts/icon-7-stroke/css/pe-icon-7-stroke.css" rel="stylesheet">
<link href="./HotelUser/assets/fonts/icon-7-stroke/css/helper.css" rel="stylesheet">
<link href="./HotelUser/assets/css/animate.css" rel="stylesheet" media="screen">
<link rel="stylesheet" href="./HotelUser/assets/css/bootstrap-select.min.css"> 
<link rel="stylesheet" href="./HotelUser/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="./HotelUser/assets/css/icheck.min_all.css">
<link rel="stylesheet" href="./HotelUser/assets/css/price-range.css">
<link rel="stylesheet" href="./HotelUser/assets/css/owl.carousel.css">  
<link rel="stylesheet" href="./HotelUser/assets/css/owl.theme.css">
<link rel="stylesheet" href="./HotelUser/assets/css/owl.transitions.css">
<link rel="stylesheet" href="./HotelUser/assets/css/style.css">
<link rel="stylesheet" href="./HotelUser/assets/css/responsive.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false);
		function hideURLbar(){ window.scrollTo(0,1); } </script>
<!-- //for-mobile-apps -->
<link href="./sofa/css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<link href="./sofa/css/style.css" rel="stylesheet" type="text/css" media="all" />
<!-- js -->
<script type="text/javascript" src="./sofa/js/jquery-2.1.4.min.js"></script>
<!-- //js -->
<!--animate-->
<link href="./sofa/css/animate.css" rel="stylesheet" type="text/css" media="all">
<script src="./sofa/js/wow.min.js"></script>
	<script>
		 new WOW().init();
	</script>
<!--//end-animate-->
<link href='http://fonts.googleapis.com/css?family=Kanit:400,100,100italic,200,200italic,300,300italic,400italic,500,500italic,600,600italic,700,700italic,800,800italic,900,900italic' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Lato:400,100,100italic,300,300italic,400italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="./sofa/js/numscroller-1.0.js"></script>
<!-- start-smoth-scrolling -->
<!-- <script type="text/javascript" src="./sofa/js/move-top.js"></script>
<script type="text/javascript" src="./sofa/js/easing.js"></script> -->
<script type="text/javascript">
	jQuery(document).ready(function($) {
		$(".scroll").click(function(event){		
			event.preventDefault();
			$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
		});
	});
</script>
<!-- start-smoth-scrolling -->
<script src="./sofa/js/responsiveslides.min.js"></script>

</head>
<body>
<!-- header -->

<!-- //header -->
<!-- banner -->
<!-- <div class="banner w3ls"> -->
	<div class="container">
		<div class="clearfix"></div>
		<div class="banner-info wow bounceInDown" data-wow-duration="1.5s" data-wow-delay="0s">
			<div  id="top" class="callbacks_container">
				<ul class="rslides" id="slider3">
					<li>
						<div class="col-md-5 ban-left">
							<img src="images/p10.jpg" alt=" "/>
						</div>
						<div class="col-md-7 ban-right">
							<h3>页面一</p>
							<a class="hvr-rectangle-out" href="about.html">查看更多</a>
						</div>
						<div class="clearfix"></div>
					</li>
					<li>
						<div class="col-md-5 ban-left">
							<img src="images/p3.jpg" alt=" "/>
						</div>
						<div class="col-md-7 ban-right">
							<h3>页面2</p>
							<a class="hvr-rectangle-out" href="about.html">查看更多</a>
						</div>
						<div class="clearfix"></div>
					</li>
				</ul>
				<a href="#" class="callbacks_nav callbacks1_nav prev">Previous</a>
			</div>
			<div class="clearfix"></div>
			<script>
						// You can also use "$(window).load(function() {"
						$(function () {
						 // Slideshow 4
						$("#slider3").responsiveSlides({
							auto: true,
							pager: false,
							nav: true,
							speed: 500,
							namespace: "callbacks",
							before: function () {
						$('.events').append("<li>before event fired.</li>");
						},
						after: function () {
							$('.events').append("<li>after event fired.</li>");
							}
							});
						});
			</script>

		</div>
	</div>
<!-- </div> -->
<!-- //banner -->
<!-- about -->

<!-- //about -->
<!-- <script type="text/javascript">
	$(window).load(function() {
		$("#flexiselDemo1").flexisel({
			visibleItems: 2,
			animationSpeed: 1000,
			autoPlay: true,
			autoPlaySpeed: 3000,    		
			pauseOnHover: true,
			enableResponsiveBreakpoints: true,
			responsiveBreakpoints: { 
				portrait: { 
					changePoint:480,
					visibleItems: 1
				}, 
				landscape: { 
					changePoint:640,
					visibleItems: 1
				},
				tablet: { 
					changePoint:991,
					visibleItems: 1
				}
			}
		});
		
	});
</script> -->
<script type="text/javascript" src="./sofa/js/jquery.flexisel.js"></script>

<!-- smooth scrolling -->
	<script type="text/javascript">
		$(document).ready(function() {
		/*
			var defaults = {
			containerID: 'toTop', // fading element id
			containerHoverID: 'toTopHover', // fading element hover id
			scrollSpeed: 1200,
			easingType: 'linear' 
			};
		*/								
		$().UItoTop({ easingType: 'easeOutQuart' });
		});
	</script>
	<a href="#" id="toTop" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>
<!-- //smooth scrolling -->
<script type="text/javascript" src="./sofa/js/bootstrap-3.1.1.min.js"></script>
<div id="preloader">
	<div id="status">&nbsp;</div>
</div>
<!-- Body content -->


<div class="header-connect">
	<div class="container">
		<div class="row">
			<div class="col-md-5 col-sm-8  col-xs-12">
				<div class="header-half header-call">
					<p>
						<span><i class="pe-7s-call"></i> +1 234 567 7890</span>
						<span><i class="pe-7s-mail"></i> your@company.com</span>
					</p>
				</div>
			</div>
			<div class="col-md-2 col-md-offset-5  col-sm-3 col-sm-offset-1  col-xs-12">
				<!-- <div class="header-half header-social">
					<ul class="list-inline">
						<li><a href="#"><i class="fa fa-facebook"></i></a></li>
						<li><a href="#"><i class="fa fa-twitter"></i></a></li>
						<li><a href="#"><i class="fa fa-vine"></i></a></li>
						<li><a href="#"><i class="fa fa-linkedin"></i></a></li>
						<li><a href="#"><i class="fa fa-dribbble"></i></a></li>
						<li><a href="#"><i class="fa fa-instagram"></i></a></li>
					</ul>
				</div> -->
			</div>
		</div>
	</div>
</div>       
<!--End top header -->

<nav class="navbar navbar-default ">
	<div class="container">
		<!-- Brand and toggle get grouped for better mobile display -->
		<div class="navbar-header">
			<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navigation">
				<span class="sr-only">Toggle navigation</span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
			</button>
			<a class="navbar-brand" href="index.html"><img src="./HotelUser/assets/img/logo.png" alt=""></a>
		</div>

		<!-- Collect the nav links, forms, and other content for toggling -->
		<div class="collapse navbar-collapse yamm" id="navigation">
			<div class="button navbar-right" id="login">
				<!-- <button class="navbar-btn nav-button wow bounceInRight login" onclick=" window.open('register.html')" data-wow-delay="0.4s">Login</button>
				<button class="navbar-btn nav-button wow fadeInRight" onclick=" window.open('submit-property.html')" data-wow-delay="0.5s">Submit</button> -->
			</div>
			<ul class="main-nav nav navbar-nav navbar-right">
				<li class="dropdown ymm-sw " data-wow-delay="0.1s">
					<a href="./HotelUser-message&ordes.html" class="dropdown-toggle">个人中心</a>
					<!-- <ul class="dropdown-menu navbar-nav">
						<li>
							<a href="index-2.html">Home Style 2</a>
						</li>
						<li>
							<a href="index-3.html">Home Style 3</a>
						</li>
						<li>
							<a href="index-4.html">Home Style 4</a>
						</li>
						<li>
							<a href="index-5.html">Home Style 5</a>
						</li>

					</ul> -->
				</li>

				<li class="wow fadeInDown" data-wow-delay="0.1s"><a class="dropdown-toggle" href="./HotelUser-hotel.html">预订酒店</a></li>
				<li class="wow fadeInDown" data-wow-delay="0.1s"><a class="dropdown-toggle active" href="#">精品商城</a></li>
				<li class="dropdown yamm-fw" data-wow-delay="0.1s">
					<a href="./HotelUser-food.html" class="dropdown-toggle" >点餐堂食</a>
				   
				</li>

				<!-- <li class="wow fadeInDown" data-wow-delay="0.4s"><a href="contact.html">尊享服务</a></li> -->
			</ul>
		</div><!-- /.navbar-collapse -->
	</div><!-- /.container-fluid -->
</nav>
<!-- End of nav bar -->

<div class="page-head"> 
	<div class="container">
		<div class="row">
			<div class="page-head-content">
				<h1 class="page-title">凤嘉昶客栈</h1>               
			</div>
		</div>
	</div>
</div>
<!-- End page header -->

<div class="site-nav-bg">
	<div class="site-nav w1200">
	  <!-- <p class="sn-back-home">
		<i class="layui-icon layui-icon-home"></i>
		<a href="#">首页</a>
	  </p> -->
	  <div class="sn-quick-menu">
		<!-- <div class="login"><a href="login.html">登录</a></div> -->
		<div class="sp-cart" style="border:1px brown soild;"><a href="./HotelUser-shopcart.html"><h4>购物车</h4></a></div>
	  </div>
	</div>
  </div>



  <div class="header">
	<div class="headerLayout w1200">
	  <div class="headerCon">
		<!-- <h1 class="mallLogo">
		  <a href="#" title="母婴商城">
			<img src="res/static/img/logo.png">
		  </a>
		</h1> -->
		<div class="mallSearch">
		  <form action="" class="layui-form" novalidate>
			<input type="text" name="title" required  lay-verify="required" autocomplete="off" class="layui-input" placeholder="请输入需要的商品">
			<button class="layui-btn" lay-submit lay-filter="formDemo" style="float: right; margin-top: -2px;">
				<i class="layui-icon layui-icon-search" ></i>
			</button>
			<input type="hidden" name="" value="">
		  </form>
		</div>
	  </div>
	</div>
  </div>


  <div class="content content-nav-base commodity-content">
	<div class="main-nav">
	  <div class="inner-cont0">
		<div class="inner-cont1 w1200">
		  <div class="inner-cont2">
			<a href="./HotelUser-shop.html" class="active">所有商品</a>
			<!-- <a href="buytoday.html">今日团购</a> -->
			<!-- <a href="information.html">母婴资讯</a>
			<a href="about.html">关于我们</a> -->
		  </div>
		</div>
	  </div>
	</div>
	<div class="banner w3ls">
<!-- <div class="container">
<div class="clearfix"></div>
<div class="banner-info wow bounceInDown" data-wow-duration="1.5s" data-wow-delay="0s">
	<div  id="top" class="callbacks_container">
		<ul class="rslides" id="slider3">
			<li>
				<div class="col-md-5 ban-left">
					<img src="images/p10.jpg" alt=" "/>
				</div>
				<div class="col-md-7 ban-right">
					<h3>页面一</p>
					<a class="hvr-rectangle-out" href="about.html">查看更多</a>
				</div>
				<div class="clearfix"></div>
			</li>
			<li>
				<div class="col-md-5 ban-left">
					<img src="images/p3.jpg" alt=" "/>
				</div>
				<div class="col-md-7 ban-right">
					<h3>页面2</p>
					<a class="hvr-rectangle-out" href="about.html">查看更多</a>
				</div>
				<div class="clearfix"></div>
			</li>
		</ul>
	</div>
	<div class="clearfix"></div>
	<script>
				// You can also use "$(window).load(function() {"
				$(function () {
				 // Slideshow 4
				$("#slider3").responsiveSlides({
					auto: true,
					pager: false,
					nav: true,
					speed: 500,
					namespace: "callbacks",
					before: function () {
				$('.events').append("<li>before event fired.</li>");
				},
				after: function () {
					$('.events').append("<li>after event fired.</li>");
					}
					});
				});
	</script>

</div>
</div> -->
	<div class="commod-cont-wrap">
	  <div class="commod-cont w1200 layui-clear">
		<div class="left-nav">
		  <div class="title">所有分类</div>
		  <div class="list-box" id="list-box">

			
	
		  </div>
		  
		<!-- <div class="layui-clear">
		  <div class="aside">
			<h4>热销推荐</h4>
			<div class="item-list" id="recomend">
			</div>
		  </div>
		</div> -->

		<div class="layui-clear">
		  <div class="aside">
			<h4>新品推荐</h4>
			<div class="item-list" id="new">
			</div>
		  </div>
		</div>
		</div>




		<div class="right-cont-wrap">
		  
		  <div class="right-cont">
			<div class="col-xs-10 page-subheader sorting pl0">
			  <ul class="sort-by-list" id="sortlist">
				</ul>
			  
			</div>
			<!-- <div class="prod-number">
			  <span>200个</span>
			</div> -->
			<div class="cont-list layui-clear" id="list-cont">
			</div>
			<!-- 模版引擎导入 -->
			<!-- <script type="text/html" id="demo">
			  {{# layui.each(d.menu.milk.content,function(index,item){}}    
				<div class="item">
				  <div class="img">
					<a href="javascript:;"><img src="{{item.img}}"></a>
				  </div>
				  <div class="text">
					<p class="title"></p>
					<p class="price">
					  <span class="pri">{{item.pri}}</span>
					  <span class="nub">{{item.nub}}</span>
					</p>
				  </div>
				</div>
			  {{# }); }}
			</script> -->
			<div id="demo0" style="text-align: center;"></div>
		  </div>
		</div>
	  </div>
	</div>
  </div>
<!-- <script src="./HotelUser/assets/js/modernizr-2.6.2.min.js"></script> -->
<!-- <script src="./HotelUser/assets/js/jquery-1.10.2.min.js"></script> -->
<script src="./HotelUser/bootstrap/js/bootstrap.min.js"></script>
<script src="./HotelUser/assets/js/bootstrap-select.min.js"></script>
<script src="./HotelUser/assets/js/bootstrap-hover-dropdown.js"></script>
<script src="./HotelUser/assets/js/easypiechart.min.js"></script>
<script src="./HotelUser/assets/js/jquery.easypiechart.min.js"></script>
<script src="./HotelUser/assets/js/owl.carousel.min.js"></script>
<script src="./HotelUser/assets/js/wow.js"></script>
<script src="./HotelUser/assets/js/icheck.min.js"></script>
<script src="./HotelUser/assets/js/price-range.js"></script>
<script src="./HotelUser/assets/js/main.js"></script>
<script>
var user = JSON.parse(localStorage.getItem("nowuser"));
console.log("user=", user);
if(user==null){
let lo=''
lo+="<button class='navbar-btn nav-button wow bounceInRight login' onclick='login();' data-wow-delay='0.4s'>登录</button>"
document.getElementById('login').innerHTML=lo;
}
function login(){
window.location.href='index.html'
}
  // localStorage.clear()

  var sortdiv='';
	sortdiv+="<li class=''>"+
					"<a href='javascript:a1();' class='order_by_date' data-orderby='property_date' data-order='ASC'>"+
						"销量 <i class='fa fa-sort-amount-asc'></i>"+					
					"</a>"+
				"</li>"+
				"<li class=''>"+
					"<a href='javascript:b1(1);' class='order_by_price' data-orderby='property_price' data-order='DESC'>"+
						"价格<i class='fa fa-sort-numeric-asc'></i>"+						
					"</a>"+
				"</li>"
	document.getElementById('sortlist').innerHTML=sortdiv;
function jumptodetails(data){
		
		var ac=data
		console.log(ac)
		// alert(data);
		localStorage.setItem('shopdetailsdata',JSON.stringify(data))
	 
//路径+参数名+参数值
window.location.href = './HotelUser-shop-details.html?'+'id='+data.id
//2.下面这种方式将数据进行编码，可以传递中文不出现乱码，推荐
// window.location.href = encodeURI('./02.html?uname=哈哈');


	};
	$.ajax({
	url: "https://douzi.wiki:7000/GROW/api/goodsCategory?page=9&limit=0",
  type: "get",
  dataType: "json",
  contentType: "application/json",
  // async:false,
  success: function (res) {
	// alert(1234)
	console.log(res)
	console.log(res.msg)
	  var h=''
	if(res.msg==="成功"){   
	  
	 
	  $.each(res.data,function(i,n){
	  
	  h+=
		"<dt onclick='select("+n.id+");' style='height:50px;line-height:50px;text-align: center;'>"+n.name+"</dt>"
   
	  });

	 
	}
	 document.getElementById('list-box').innerHTML=h
  },

  error: function (res) {
	alert("访问失败")
},

  });
  $.ajax({
	url: "https://douzi.wiki:7000/GROW/api/goods?page=1&limit=2",
  type: "get",
  dataType: "json",
  contentType: "application/json",
  // async:false,
  success: function (res) {
	var h1='';
	// alert(1234)
	console.log(res)
	console.log(res.msg)
	if(res.msg==="成功")
	{
	   localStorage.setItem('shopdata',JSON.stringify(res.data))
	
	   console.log(res.data)
	   let nre=res.data.sort(sortheat);
	  let nnew=res.data.sort(sortstock);
	  var re=''
	  var anew=''
	  for(let i=0;i<3;i++){

		re+="<li>"+
			"<div class='col-md-5 ban-left'>"+
				"<img src='iamges/10.jpg' alt=''>"+
			"</div>"+
			"<div class='col-md-7 ban-right'>"+
			"<h3>热门推荐</p>"+
				// "<p><span>"+nre[i].name+"</span><span class='pric'>￥"+nre[i].cashPrice+"</span><span class='pric'>&nbsp;&nbsp;&nbsp;&nbsp;*"+nre[i].pointsPrice+"</span></p>"+
			"<a class='hvr-rectangle-out' onclick='jumptodetails("+JSON.stringify(nre[i])+");' href=#'>查看更多</a>"+
"</div>"+
"<div class='clearfix'></div>"+
		// "<div class='item' onclick='jumptodetails("+JSON.stringify(nre[i])+");'>"+
		//   "<img src='res/static/img/details_img2.jpg'>"+
		//   "<p><span>"+nre[i].name+"</span><span class='pric'>￥"+nre[i].cashPrice+"</span><span class='pric'>&nbsp;&nbsp;&nbsp;&nbsp;*"+nre[i].pointsPrice+"</span></p>"+
		// "</div>"
		// anew+="<div class='item' onclick='jumptodetails("+JSON.stringify(nnew[i])+");'>"+
		//   "<img src='res/static/img/details_img2.jpg'>"+
		//   "<p><span>"+nnew[i].name+"</span><span class='pric'>￥"+nnew[i].cashPrice+"</span><span class='pric'>*"+nnew[i].pointsPrice+"</span></p>"+
		// "</div>"+
		"</li>"


	  }
	  document.getElementById('slider3').innerHTML=re;
	  document.getElementById('new').innerHTML=anew;
	  localStorage.setItem('selectdata',JSON.stringify(res.data))
	  selectdisplay()
	  //     }); 
	   
	}

  },

  error: function (res) {
	alert("访问失败")
},

  });








	function selectdisplay(){
	  layui.config({
		  base: 'res/static/js/util/' //你存放新模块的目录，注意，不是layui的模块目录
		}).use(['mm','laypage','jquery'],function(){
			var laypage = layui.laypage,$ = layui.$,
		  mm = layui.mm;
		  let data = JSON.parse(localStorage.getItem('selectdata'));
		  console.log(data)
			laypage.render({
			  elem: 'demo0', // 存放分页控件的容器
						  count: data.length, //数据总数。一般通过服务端得到
						  limit: 5,//每页显示的条数。laypage将会借助 count 和 limit 计算出分页数。
						  limits: [5, 10,15,20,25,45, 50],//每页条数的选择项
						  layout: ['prev', 'page', 'next', 'limit', 'limits'],
						  theme: '#F457F2', //自定义主题
						  jump: function (obj) {//模拟渲染
							  document.getElementById('list-cont').innerHTML = function () {
								  let arr = [];
								  console.log(data)
								  let thisData = data.concat().splice(obj.curr * obj.limit - obj.limit, obj.limit);
								  console.log(thisData)
								  layui.each(thisData, function (i, n) {
									  arr.push(  
									"<div class='item' style='height:450x;' onclick='jumptodetails("+JSON.stringify(n)+");'>"+
									  "<div class='img'>"+
										"<a href='javascript:;'><img src='res/static/img/paging_img1.jpg'></a>"+
									  "</div>"+
									  "<div class='text' >"+
										"<p class='title'>"+n.name+"</p>"+
										"<p class='price' style='margin-top: -5px;'>"+
										  "<span class='pri'>￥"+n.cashPrice+"</span>"+
										  "<span class='pri'>&nbsp;&nbsp;&nbsp;&nbsp;*"+n.pointsPrice+"</span>"+
										  "<span class='nub'>"+n.describe+"</span>"+
										"</p>"+
									  "</div>"+
									"</div>"
					  );
					  // alert(arr)
					  
								  });return arr.join('');
								}();
						  },
						  page:true
					
			});


	  });
	}
  function select(id){
	localStorage.setItem('selectid',id)
	console.log('id='+id)
	$.ajax({
	url: "https://douzi.wiki:7000/GROW/api/goods?page=1&limit=2",
	  type: "get",
	  dataType: "json",
	  contentType: "application/json",
	  // async:false,
	  success: function (res) {
		// alert(1234)
		console.log(res)
		console.log(res.msg)
		var h1='['
		if(res.msg==="成功"){
		  let count=0;
			  $.each(res.data,function(i,n){
				// console.log('i='+i)
				if (n.tgoodsCategoryId==id) {
				  count++;
				  if(count==1){
					h1+=JSON.stringify(n);
				  }
				  else{
				   h1+=','+JSON.stringify(n);                           
				  }

	 }
		  });  
		  h1+=']'
		  localStorage.setItem('selectdata',h1)
				  console.log(JSON.parse(h1))
				  selectdisplay();
		}
		//  document.getElementById('list-cont').innerHTML=h1;
		// retrun
	  },
	
	  error: function (res) {
		alert("访问失败")
	},

	  });
  }
  function sortheat(a,b){
	return b.heat-a.heat;
  }
  function sortstock(a,b){
	return b.stock-a.stock;
  }
  var n=JSON.parse(localStorage.getItem('nowdata'));
		console.log("a下上");
		var n1=n.sort(sortStock1);


	
layui.config({
base: 'res/static/js/util/' //你存放新模块的目录，注意，不是layui的模块目录
}).use(['mm','laypage','jquery'],function(){
var laypage = layui.laypage,$ = layui.$,
mm = layui.mm;
let data = JSON.parse(localStorage.getItem('shopdata'));
console.log(data)
laypage.render({
elem: 'demo0', // 存放分页控件的容器
			count: data.length, //数据总数。一般通过服务端得到
			limit: 5,//每页显示的条数。laypage将会借助 count 和 limit 计算出分页数。
			limits: [5, 10,15,20,25,45, 50],//每页条数的选择项
			layout: ['prev', 'page', 'next', 'limit', 'limits'],
			theme: '#F457F2', //自定义主题
			jump: function (obj) {//模拟渲染
				document.getElementById('list-cont').innerHTML = function () {
					let arr = [];
					console.log(data)
					// console.log(JSON.stringify(data))
					let thisData = data.concat().splice(obj.curr * obj.limit - obj.limit, obj.limit);
					console.log(thisData)
					layui.each(thisData, function (i, n) {
						arr.push(  
						  "<div class='item' style='height:450x;' onclick='jumptodetails("+JSON.stringify(n)+");'>"+
						"<div class='img'>"+
						  "<a href='javascript:;'><img src='res/static/img/paging_img1.jpg'></a>"+
						"</div>"+
						"<div class='text' >"+
						  "<p class='title'>"+n.name+"</p>"+
						  "<p class='price' style='margin-top: -5px;'>"+
							"<span class='pri'>￥"+n.cashPrice+"</span>"+
							"<span class='pri'>&nbsp;&nbsp;&nbsp;&nbsp;*"+n.pointsPrice+"</span>"+
							"<span class='nub'>"+n.describe+"</span>"+
						  "</p>"+
						"</div>"+
					  "</div>"
		 );
		 
					});return arr.join('');
				  }();
			},
			page:true
	  
});


});
function jump(meiyong){
layui.config({
base: 'res/static/js/util/' //你存放新模块的目录，注意，不是layui的模块目录
}).use(['mm','laypage','jquery'],function(){
var laypage = layui.laypage,$ = layui.$,
mm = layui.mm;
let data = JSON.parse(localStorage.getItem('productsortdata'));
console.log(data)
laypage.render({
elem: 'demo0', // 存放分页控件的容器
			count: data.length, //数据总数。一般通过服务端得到
			limit: 5,//每页显示的条数。laypage将会借助 count 和 limit 计算出分页数。
			limits: [5, 10,15,20,25,45, 50],//每页条数的选择项
			layout: ['prev', 'page', 'next', 'limit', 'limits'],
			theme: '#F457F2', //自定义主题
			jump: function (obj) {//模拟渲染
				document.getElementById('list-cont').innerHTML = function () {
					let arr = [];
					console.log(data)
					let thisData = data.concat().splice(obj.curr * obj.limit - obj.limit, obj.limit);
					console.log(thisData)
					layui.each(thisData, function (i, n) {
						arr.push(  
					  "<div class='item' style='height:450x;' onclick='jumptodetails("+JSON.stringify(n)+");'>"+
						"<div class='img'>"+
						  "<a href='javascript:;'><img src='res/static/img/paging_img1.jpg'></a>"+
						"</div>"+
						"<div class='text' >"+
						  "<p class='title'>"+n.name+"</p>"+
						  "<p class='price' style='margin-top: -5px;'>"+
							"<span class='pri'>￥"+n.cashPrice+"</span>"+
							"<span class='pri'>&nbsp;&nbsp;&nbsp;&nbsp;*"+n.pointsPrice+"</span>"+
							"<span class='nub'>"+n.describe+"</span>"+
						  "</p>"+
						"</div>"+
					  "</div>"
		 );
		 
					});return arr.join('');
				  }();
			},
			page:true
	  
});


});
};




	 function jumptodetails(data){
	  var ac=data;
		console.log(ac)
		
		// alert(data);
		
		localStorage.setItem('productdetailsdata',JSON.stringify(data))
	 
		//路径+参数名+参数值
		window.location.href = './HotelUser-shop-details.html?'+'id='+data.id
		//2.下面这种方式将数据进行编码，可以传递中文不出现乱码，推荐
		// window.location.href = encodeURI('./02.html?uname=哈哈');


	};
	
	//排序 库存升序
	function sortStock1(a,b){
		return a.stock-b.stock;
	}
	//排序 库存降序
	function sortStock2(a,b){
		return b.stock-a.stock;
	}
	//排序 小到大面积
	function sortPrice1(a,b){
		return a.cashPrice-b.cashPrice;
	}
	//排序 大到小面积
	function sortPrice2(a,b){
		return b.cashPrice-a.cashPrice;
	}  
	//a下下
   function a1(){
	 
	let selectid=localStorage.getItem('selectid')
	console.log('selectid='+selectid)
	localStorage.removeItem('selectid')
	if(selectid!=''){
	  var n=JSON.parse(localStorage.getItem('selectdata'));
	}
	else{
	  var n=JSON.parse(localStorage.getItem('shopdata'));
	}
		localStorage.setItem('nowdata',JSON.stringify(n))
		console.log("a下下+n="+n.name);
		var n1=n.sort(sortStock1);
		localStorage.setItem('productsortdata',JSON.stringify(n1))
		// console.log(n);
		var sortdiv='';
	sortdiv+="<li class='active'>"+
					"<a href='javascript:a3();' class='order_by_date' data-orderby='property_date' data-order='ASC'>"+
						"销量 <i class='fa fa-sort-amount-asc'></i>"+					
					"</a>"+
				"</li>"+
				"<li class=''>"+
					"<a href='javascript:b1();' class='order_by_price' data-orderby='property_price' data-order='ASC'>"+
						"价格<i class='fa fa-sort-numeric-asc'></i>"+						
					"</a>"+
				"</li>"
	document.getElementById('sortlist').innerHTML=sortdiv;
	var cPage =1;//当前页，默认为1。
	jump(cPage)
	}
	//a下上
	function a2(dex){
	  let selectid=localStorage.getItem('selectid')
	console.log('selectid='+selectid)
	localStorage.removeItem('selectid')
	if(selectid!=''){
	  var n=JSON.parse(localStorage.getItem('selectdata'));
	}
	else{
	  var n=JSON.parse(localStorage.getItem('shopdata'));
	}
		console.log("a下上");
		var n1=n.sort(sortStock1);
		localStorage.setItem('productsortdata',JSON.stringify(n1))
		// console.log(n);
		var sortdiv='';
	sortdiv+="<li class='active'>"+
					"<a href='javascript:a4();' class='order_by_date' data-orderby='property_date' data-order='ASC'>"+
						"销量 <i class='fa fa-sort-amount-asc'></i>"+					
					"</a>"+
				"</li>"+
				"<li class=''>"+
					"<a href='javascript:b2();' class='order_by_price' data-orderby='property_price' data-order='DESC'>"+
						"价格<i class='fa fa-sort-numeric-desc'></i>"+						
					"</a>"+
				"</li>"
	document.getElementById('sortlist').innerHTML=sortdiv;
	var cPage =1;//当前页，默认为1。
	jump(cPage)
	} 
	//a上下
	function a3(){
	  let selectid=localStorage.getItem('selectid')
	console.log('selectid='+selectid)
	localStorage.removeItem('selectid')
	if(selectid!=''){
	  var n=JSON.parse(localStorage.getItem('selectdata'));
	}
	else{
	  var n=JSON.parse(localStorage.getItem('shopdata'));
	}
		console.log('a上下');
		var n1=n.sort(sortStock2);
		localStorage.setItem('productsortdata',JSON.stringify(n1))
		// console.log(n);
		var sortdiv='';
	sortdiv+="<li class='active'>"+
					"<a href='javascript:a1();' class='order_by_date' data-orderby='property_date' data-order='DESC'>"+
						"销量 <i class='fa fa-sort-amount-desc'></i>"+					
					"</a>"+
				"</li>"+
				"<li class=''>"+
					"<a href='javascript:b3();' class='order_by_price' data-orderby='property_price' data-order='ASC'>"+
						"价格<i class='fa fa-sort-numeric-asc'></i>"+						
					"</a>"+
				"</li>"
	document.getElementById('sortlist').innerHTML=sortdiv;
	var cPage =1;//当前页，默认为1。
	jump(cPage)
	}    
	//a上上
	function a4(){
	  let selectid=localStorage.getItem('selectid')
	console.log('selectid='+selectid)
	localStorage.removeItem('selectid')
	if(selectid!=''){
	  var n=JSON.parse(localStorage.getItem('selectdata'));
	}
	else{
	  var n=JSON.parse(localStorage.getItem('shopdata'));
	}
		console.log("a上上");
		var n1=n.sort(sortStock2);
		localStorage.setItem('productsortdata',JSON.stringify(n1))
		// console.log(n);
		var sortdiv='';
	sortdiv+="<li class='active'>"+
					"<a href='javascript:a2();' class='order_by_date' data-orderby='property_date' data-order='DESC'>"+
						"销量 <i class='fa fa-sort-amount-desc'></i>"+					
					"</a>"+
				"</li>"+
				"<li class=''>"+
					"<a href='javascript:b1();' class='order_by_price' data-orderby='property_price' data-order='DESC'>"+
						"价格<i class='fa fa-sort-numeric-desc'></i>"+						
					"</a>"+
				"</li>"
	document.getElementById('sortlist').innerHTML=sortdiv;
	var cPage =1;//当前页，默认为1。
	jump(cPage)
	}   
	//b下下    
	function b1(){
	  let selectid=localStorage.getItem('selectid')
	console.log('selectid='+selectid)
	localStorage.removeItem('selectid')
	if(selectid!=''){
	  var n=JSON.parse(localStorage.getItem('selectdata'));
	}
	else{
	  var n=JSON.parse(localStorage.getItem('shopdata'));
	}

		// var n=JSON.parse(localStorage.getItem('nowdata'));
		console.log("b下下");
		
		var n1=n.sort(sortPrice1);
		localStorage.setItem('productsortdata',JSON.stringify(n1))
		// console.log(n);
		var sortdiv='';
	sortdiv+="<li class=''>"+
					"<a href='javascript:a1();' class='order_by_date' data-orderby='property_date' data-order='ASC'>"+
						"销量 <i class='fa fa-sort-amount-asc'></i>"+					
					"</a>"+
				"</li>"+
				"<li class='active'>"+
					"<a href='javascript:b2();' class='order_by_price' data-orderby='property_price' data-order='ASC'>"+
						"价格<i class='fa fa-sort-numeric-asc'></i>"+						
					"</a>"+
				"</li>"
	document.getElementById('sortlist').innerHTML=sortdiv;
	var cPage =1;//当前页，默认为1。
	jump(cPage)
	}  
	//b下上
	function b2(){
	  let selectid=localStorage.getItem('selectid')
	console.log('selectid='+selectid)
	localStorage.removeItem('selectid')
	if(selectid!=''){
	  var n=JSON.parse(localStorage.getItem('selectdata'));
	}
	else{
	  var n=JSON.parse(localStorage.getItem('shopdata'));
	}
		console.log("//b下上");
		var n1=n.sort(sortPrice2);
		localStorage.setItem('productsortdata',JSON.stringify(n1))
		// console.log(n);
		var sortdiv='';
	sortdiv+="<li class=''>"+
					"<a href='javascript:a2();' class='order_by_date' data-orderby='property_date' data-order='ASC'>"+
						"销量 <i class='fa fa-sort-amount-asc'></i>"+					
					"</a>"+
				"</li>"+
				"<li class='active'>"+
					"<a href='javascript:b1();' class='order_by_price' data-orderby='property_price' data-order='DESC'>"+
						"价格<i class='fa fa-sort-numeric-desc'></i>"+						
					"</a>"+
				"</li>"
	document.getElementById('sortlist').innerHTML=sortdiv;
	var cPage =1;//当前页，默认为1。
	jump(cPage)
	}
	//b上下
	function b3(){
	  let selectid=localStorage.getItem('selectid')
	console.log('selectid='+selectid)
	localStorage.removeItem('selectid')
	if(selectid!=''){
	  var n=JSON.parse(localStorage.getItem('selectdata'));
	}
	else{
	  var n=JSON.parse(localStorage.getItem('shopdata'));
	}
		console.log("b上下");
		var n1=n.sort(sortPrice1);
		localStorage.setItem('productsortdata',JSON.stringify(n1))
		// console.log(n);
		var sortdiv='';
	sortdiv+="<li class=''>"+
					"<a href='javascript:a3();' class='order_by_date' data-orderby='property_date' data-order='DESC'>"+
						"销量 <i class='fa fa-sort-amount-desc'></i>"+					
					"</a>"+
				"</li>"+
				"<li class='active'>"+
					"<a href='javascript:b4();' class='order_by_price' data-orderby='property_price' data-order='ASC'>"+
						"价格<i class='fa fa-sort-numeric-asc'></i>"+						
					"</a>"+
				"</li>"
	document.getElementById('sortlist').innerHTML=sortdiv;
	var cPage =1;//当前页，默认为1。
	jump(cPage)
	}  
	//b上上
	function b4(){
	  let selectid=localStorage.getItem('selectid')
	console.log('selectid='+selectid)
	localStorage.removeItem('selectid')
	if(selectid!=''){
	  var n=JSON.parse(localStorage.getItem('selectdata'));
	}
	else{
	  var n=JSON.parse(localStorage.getItem('shopdata'));
	}
		console.log("b上上");
		var n1=n.sort(sortPrice2);
		localStorage.setItem('productsortdata',JSON.stringify(n1))
		// console.log(n);
		var sortdiv='';
	sortdiv+="<li class=''>"+
					"<a href='javascript:a4();' class='order_by_date' data-orderby='property_date' data-order='DESC'>"+
						"销量 <i class='fa fa-sort-amount-desc'></i>"+					
					"</a>"+
				"</li>"+
				"<li class='active'>"+
					"<a href='javascript:b3();' class='order_by_price' data-orderby='property_price' data-order='DESC'>"+
						"价格<i class='fa fa-sort-numeric-desc'></i>"+						
					"</a>"+
				"</li>"
	document.getElementById('sortlist').innerHTML=sortdiv;
	var cPage =1;//当前页，默认为1。
	jump(cPage)
	}       


</script>
</body>
</html>